import Vue from "vue";
import VueRouter from "vue-router";
import store from '../store'

Vue.use(VueRouter);

const routesDefault = [{
        path: "/login",
        name: "login",
        component: () =>
            import ("../views/login/login.vue"),
    },
    {
        name: 'main',
        path: '/',
        component: () =>
            import ('@/layout'),
        redirect: '/dashbord',
        children: [{
                name: 'Dashbord',
                path: '/dashbord',
                component: () =>
                    import ('@/views/dashbord') // 路由懒加载
            },

        ]
    }
];



const router = new VueRouter({
    mode: 'history',
    base: process.env.BASE_URL,
    routes: routesDefault,
})

/*
自定义 方法解决 动态路由重复加载问题
自定义一个 $addRoutes 方法 在这个方法中重新创建 新的 router 实例

 注意： 这种方式 只适用于 history 模式
*/
router.$addRoutes = (params) => {
    router.matcher = new VueRouter({
        mode: 'history',
        base: process.env.BASE_URL,
        routes: []
    }).matcher
    router.addRoutes(params)
}


// 导航守卫
router.beforeEach(function(to, from, next) {
    if (to.path === '/login') {
        next()
    } else {
        // 判断是否有 token 如果有 token 就放行 否则跳转到登录页面
        if (store.state.token) {
            next()
        } else {
            next('/login')
        }
    }
})

export default router;